<template>
	<view>
		<view 
		class="margin-sm u-border padding " 
		v-for="(item,index) in addressList"
		:key="index"
		:class="{'default':item.isdefault}"
		>
			<view class="default-count">
				默
			</view>
			<view class="flex  justify-between">
				<view class="flex align-center">
					<text 
					class="iconfont icon-gouxuan margin-right"
					:class="checkedIdx==index||item.isdefault?'color-yellow':''"
					@click="handleCheckAddress(index)"
					></text>
					<view class="">
						{{item.username}} {{item.phone}}
						<view class="">
							{{item.city}}
							{{item.region}}
							{{item.detail}}
						</view>
					</view>
				</view>			
				<view @click="handleEdit(index)" class="edit margin-bottom-xs"><text class="iconfont icon-bianji"></text></view>
			</view>
			<view class="flex justify-around align-center margin-top">
				<view class="" v-if="item.isdefault">
					默认地址
				</view>
				<view @click="handleDefault(index)" class="" v-else>
					设为默认
				</view>
				
				<u-line length="15" direction="col"></u-line>
				<view class="">
					删除地址
				</view>
			</view>
		</view>
		<view class=" text-center">
			<button class="cu-btn bg-brown" @click="handleAddAddress">新增地址</button>
		</view>
	</view>
</template>

<script>
	import {mapState,mapMutations} from 'vuex'
	export default {
		data() {
			return {
				
			}
		},
		computed:{
			...mapState({
				addressList:state=>state.address.addressList,
				checkedIdx:state=>state.address.checkedIdx,
				userInfo:state=>state.user.userInfo
			})
		},
		methods: {
			...mapMutations({
				// 'handleDefault':'address/addressDefaultMut',
				'handleCheckAddress':'address/addressCheckMut'
			}),
			handleAddAddress(){
				uni.navigateTo({
					url:'./address-detail'
				})
			},
			handleDefault(idx){
				// {
				// 	"requests":[
				// 		{
				// 			"method":"PUT",
				// 			"path":`/1.1/classes/address/${onjectId}`,
				// "body":{
				// 	"isDefault":true
				// }
				// 		}
				// 	]
				// }
				let obj = {"requests":[]}
				this.addressList.forEach((item,i)=>{
					let bool=i===idx
					obj.requests.push({
						"method":"PUT",
						"path":`/1.1/classes/address/${item.objectId}`,
						"body":{
							"isDefault":bool
						}
					})
				})
				this.$post('/1.1/batch',obj).then(res=>{
					console.log(res);
					this.$store.commit('address/addressDefaultMut',idx)
				})
				
			}
		}
	}
</script>

<style lang="scss">

	.edit {
		width: 75upx;
		height: 75upx;
		text-align: center;
		line-height: 75upx;
		background-color: #e6e6e6;
		border-radius: 50%;
	}
	.default-count{
		display: none;
	}
	.default{
		position: relative;
		overflow: hidden;
		.default-count{
			padding:40upx 10upx 10upx;
			width: 100upx;
			background-color: #fae456;
			font-size: 12upx;
			text-align: center;
			position: absolute;
			top: -30upx;
			right:-40upx;
			transform: rotate(45deg);
			display: block;
		}
	}

</style>
